<!DOCTYPE html>
<html lang="en">
{include file='public/head'/}
<style>
    #container {
        width: 500px;
        margin: 20px auto;
        background-color: #fff;
    }

    .button-box {
        width: 100%;
    }

    .btn {
        margin: 0 auto;
    }
</style>
<body>
<div id="container" class="layui-form">
    <img src="{$data.weichat_img}" alt="" id="img" style="width: 500px">
    <div class="layui-form-item">
        <div class="layui-input-inline" style="width: 600px">
            <button type="button" class="layui-btn" id="upload">
                <i class="layui-icon">&#xe67c;</i>更换微信二维码图片
            </button>
        </div>
    </div>
</div>
</body>
<script>
    const url = {
        bannerUploadUrl: '/admin/image/bannerUpload',
        changeImageUrl: '/admin/info/weichatedit'
    }
    layui.use(['upload', 'jquery'], function () {
        var upload = layui.upload,
            $ = layui.jquery

        upload.render({
            elem: '#upload',
            url: url.bannerUploadUrl,
            done: function (res) {
                $('#img').attr('src', res.data.src)
                let data = {}
                data.image_url = res.data.src
                $.post(url.changeImageUrl, data, (res) => {
                    if (res.status === config.success) {
                        layer.alert("更换图片成功", {icon: 6}, () => {
                            xadmin.close();
                            xadmin.father_reload();
                        });
                    } else {
                        layer.msg(res.message, {icon: 2})
                    }
                });
            },
            error: function () {
                layer.msg('换图失败', {icon: 2})
            }
        });
    });
</script>
</html>